<template>
	<!-- 寻车我的报价 -->
	<view class="container">
		<view id="comf" class="header1">
			<u-tabs-swiper
				height="90"
				bar-width="78"
				:show-bar="false"
				inactive-color="#666666"
				bar-height="10"
				active-color="#FBB000"
				ref="uTabs"
				:list="titleList"
				:current="swiperCurrent"
				@change="tabsChange"
				:is-scroll="false"
			></u-tabs-swiper>
		</view>

		<scroll-view
			v-show="swiperCurrent === 0 || swiperCurrent === 1 || swiperCurrent === 2"
			scroll-y
			style="height: 100%;width: 100%;background-color: #F6F6F6;"
			@scrolltolower="onreachBottom"
		>
			<view class="" v-if="Myofferlist.length > 0">
				<view class="listitem boxS" v-for="(item, index) in Myofferlist" :key="index">
					<view class="li-top">
						<view class="li-top1">
							<view class="shopimg"><i-icon icon="icondianpu" type="single" size="40rpx" color="#fbd220"></i-icon></view>
							<view class="shopcss">{{ item.store_Name }}</view>
							<view class="badimg"><i-icon icon="iconbao_1" type="single" size="32rpx" color="#fbd220"></i-icon></view>
						</view>
						<view class="stas">{{ titleList[item.state].name }}</view>
					</view>
					<view class="centercss">
						<view class="offleft" @click="baojiaclick(item)">
							<view class="offleftimg"><i-icon icon="iconguanxun" class="middle" type="single" size="34rpx" color="#EB5C02"></i-icon></view>
							<view class="offright">
								<view class="ofrtitle">{{ item.car_Type_Name }}{{ item.car_Name }}</view>
								<view class="ofrcolor">
									<view class="ofrtitlewg">外观/内饰：</view>
									<view class="ofrquanbox">
										<view class="" v-for="(color, ind) in item.facade_PictureList" :key="ind">
											<view class="flex-jc-sb width-100 color-333" v-if="color.outerColour && color.inColour">
												<view :style="{ background: color.outerColour.colorCoding }" class="iconcolor"></view>
												{{ color.outerColour.color }} /{{ color.inColour.color }}
												<view v-if="color.inColour.neiColor.length == 1" :style="{ background: color.inColour.colorCoding }" class="iconcolor"></view>
												<view v-else class="iconcolor"><view class="iconcolor2" v-for="(it, i) in color.inColour.neiColor" :key="i" :style="{ background: it }"></view></view>
											</view>
										</view>
									</view>
								</view>
								<view class="ofrcolor">
									<view class="ofrtitlewg">卖：</view>
									<view class="ofrquanbox">
										<view class="ofrqconamebj">{{ item.sale_Region_Name }}</view>
									</view>
								</view>
								<view class="ofrcolor">
									<view class="ofrtitlewg">指导价：</view>
									<view class="ofrquanbox">
										<view class="ofrqconamebj">{{ item.price }}</view>
									</view>
								</view>
								<view class="ofrcolor">
									<view class="ofrtitlewg">我的报价：</view>
									<view class="ofrquanbox">
										<view class="ofrqconamebaojia">￥{{ item.quoted_Price }}</view>
										<view class="ofrtime">{{ returnTime(item.addTime) }}</view>
									</view>
								</view>
							</view>
						</view>
					</view>

					<view class="xian"></view>
					<view class="footer">
						<view style="font-size: 24rpx;color: #666666;">
							<view>
								<text style="color: #EB5C02;font-weight: bold;">{{ item.views }}次</text>
								浏览
							</view>
							<view>
								<text style="color: #EB5C02;font-weight: bold;">{{ item.offerAmount }}人</text>
								报价
							</view>
						</view>
						<view class="lianxibox flex flex-jc-c flex-ai-c" v-if="item.state === 0">
							<view class="lianxi flex flex-jc-c flex-ai-c" @click="contactSeller(item)">
								<i-icon icon="iconxiaoxi" class="middle mr-5" type="single" size="29rpx" color="#343434"></i-icon>
								联系买家
							</view>
							<view class="lianxi flex flex-jc-c flex-ai-c" style="margin-left: 24rpx;" @click="phoneClick(item.phone)">
								<i-icon icon="iconlianxi" class="middle mr-5" type="single" size="29rpx" color="#343434"></i-icon>
								致电买家
							</view>
						</view>
						<view class="lianxibox flex flex-jc-c flex-ai-c" @click.stop="ConfirmContract(item.contractId)" v-else-if="item.state === 1">
							<view class="lianxi flex flex-jc-c flex-ai-c">确认合同</view>
						</view>
						<view class="lianxibox flex flex-jc-c flex-ai-c" v-else-if="item.state === 2"><view class="lianxi flex flex-jc-c flex-ai-c" @click="baojiaclick(item)">查看详情</view></view>

						<!-- <view style="display: flex;">
				      <image style="margin-left: 32rpx;width: 200rpx;height: 60rpx;" :src="Core.globalImgUrlBussiness + '/Sxy_orderAdmin/lianxi@2x.png'"
				        @click="bussClick"></image>
				      <image style="margin-left: 32rpx;width: 200rpx;height: 60rpx;" :src="Core.globalImgUrlBussiness + '/Sxy_orderAdmin/dianhua@2x.png'"
				        @click="phoneClick(item.phone)"></image>
				    </view> -->
					</view>
				</view>
			</view>
			<defaultImg v-else></defaultImg>
		</scroll-view>

		<!-- 暂时用不上这个沟通 已隐藏-->
		<scroll-view v-if="swiperCurrent === 3" scroll-y :class="IMlist.length > 0?'boxSs':''" style="margin-top: 24rpx; height: 100%;width: 96%;background-color: #F6F6F6;" @scrolltolower="onreachBottom">
			<!-- <view class="assas boxS"> -->
			<view class="" v-if="IMlist.length > 0">
				<u-swipe-action :show="item.show" :options="options" :btn-width="btnWidth" class="u-skeleton-rect" v-for="(item, index) in IMlist" :key="index">
					<view class="item u-border-bottom" @click="contentClick(index)">
						<image mode="aspectFill" :src="item.img" />
						<view class="title-wrap">
							<view class="title2 u-line-2" style="font-size: 30rpx;color: #343434;">
								{{ item.user }}
								<view class="time" style="font-size: 24rpx;color: #B9B9B9;">{{ $u.timeFormat(item.lastTime, 'yyyy-mm-dd') }}</view>
							</view>
							<view class="title2 u-line-2">
								<view style="width: 280rpx;font-size: 24rpx;color: #9A9A9A;">{{ item.messageForShow }}</view>
								<view class="weidu twoxi">{{ item.unreadCount }}+</view>
							</view>
						</view>
					</view>
				</u-swipe-action>
			</view>
			<defaultImg v-else msg="暂无沟通信息,快去沟通吧"></defaultImg>
			<!-- <view class="" v-else></view> -->
			<!-- </view> -->
		</scroll-view>
	</view>
</template>

<script src="./myOffer.js"></script>
<style lang="scss" scoped>
@import './myOffer.scss';
@import '../style/common.scss';
</style>
